<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>update</title>
    <style>
        body {
        /*字体族，确保无论用户的系统环境如何，文本都能以一种可读的形式显示*/
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 20px;
        }
        h1 {
            color: #333;
            text-align: center;
            margin-bottom: 20px;
        }
        form {
            background-color: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            max-width: 600px;
            margin: 0 auto;
        }
        label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
            color: #555;
        }
        input[type="text"] {
            width: 90%;
            padding: 10px;
            margin-bottom: 15px;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        .btn-edit {
            background-color: #00A2E8;
            color: #fff;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            display: block;
            width: 100%;
            font-size: 16px;
        }
        .btn-edit:hover {
            background-color: #3282F6;
        }
        .btn-cancel{
            background-color: #eee;
            color: #000;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            display: block;
            width: 100%;
            font-size: 16px;
            margin-top:10px;
        }
        .form-group {
            margin-bottom: 15px;
        }
        .form-control {
            width: 90%;
            padding: 10px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 4px;
            background-color: #fff;
            color: #555;
            appearance: none; /* 移除默认的样式，特别是下拉箭头 */
            -webkit-appearance: none; /* 兼容 Safari 和 Chrome */
            -moz-appearance: none; /* 兼容 Firefox */
            /*将一个内嵌的SVG（可缩放矢量图形）作为背景图像应用到元素上*/
            background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="%23999" d="M2 0L0 2h4zm0 5L0 3h4z"/></svg>');
            background-repeat: no-repeat;
            background-position: right 10px center;
            background-size: 10px;
        }
        .form-control:focus {
            border-color: #80bdff;
            outline: none;
            box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
        }
    </style>
</head>
<body>
    <h1>修改学生信息</h1>
    <form action="{{ url_for('update_record', Sno=record.Sno) }}" method="post">
        <div>
            <label for="Sname">姓名:</label>
            <input type="text" id="Sname" name="Sname" value="{{ record.Sname }}">
        </div>
        <div class="form-group">
        <label for="Ssex">性别:</label>
        <select id="Ssex" name="Ssex" class="form-control" required>
            <option value="" disabled selected>请选择性别</option>
            <option value="男" {% if record.Ssex =='男' %}selected{% endif %}>男</option>
            <option value="女" {% if record.Ssex =='女' %}selected{% endif %}>女</option>
        </select>
        </div>
        <div>
            <label for="Sage">年龄:</label>
            <input type="text" id="Sage" name="Sage" value="{{ record.Sage }}">
        </div>
        <div>
            <label for="Dno">所属院系:</label>
            <input type="text" id="Dno" name="Dno" value="{{ record.Dno }}">
        </div>
        <div>
            <label for="Sclass">班级:</label>
            <input type="text" id="Sclass" name="Sclass" value="{{ record.Sclass }}">
        </div>
        <div>
            <label for="address">地址:</label>
            <input type="text" id="address" name="address" value="{{ record.address }}">
        </div>
        <div>
        <button type="submit" class="btn-edit">修改</button>
        <button type="button" class="btn-cancel" onclick="window.location.href='{{ url_for('index') }}'">取消</button>
        </div>
    </form>
</body>
</html>
